﻿<!DOCTYPE HTML>
<html lang="en" xml:lang="en">
	<head>
		<title>Product Catalogue</title>
		<meta charset="UTF-8" />

	</head>

	<body>
	
		<center><div>
			<a href="#">Apple</a>&nbsp;<a href="#">Toshiba</a>&nbsp;<a href="#">Lenovo</a>&nbsp;<a href="#">Dell</a>&nbsp;<a href="#">Asus</a>&nbsp;<a href="#">HP</a></p>
		</div></center>
		<hr />
		<div>
		  <table border="1"><tr><td>
			<table cellpadding="5">
				<tr>
					<!--<td>-->
							<!-- Left column of product catalog -->
							<td>
								<fieldset>
									<legend>Apple MacBookAir</legend>
									<table>
										<tr><td rowspan="2"><img src="..\img\apple.png" alt="Apple MacBookAir"></td><td>64GB SSD</td></tr>
										<tr><td>2GB DDR</td></tr>
										<tr><td>1300 USD</td><td>Intel Core i5</td></tr>
									</table>
								</fieldset>
								<fieldset>
									<legend>Toshiba Satelite</legend>
																<table>
										<tr><td rowspan="2"><img src="..\img\toshiba.png" alt="Toshiba Satelite"></td><td>128GB SSD</td></tr>
										<tr><td>3GB DDR</td></tr>
										<tr><td>1000 USD</td><td>Pentium B970</td></tr>
									</table>
								</fieldset>
								<fieldset>
									<legend>Lenovo ThinkPad</legend>
																<table>
										<tr><td rowspan="2"><img src="..\img\lenovo.png" alt="Lenovo ThinkPad"></td><td>128GB SSD</td></tr>
										<tr><td>4GB DDR</td></tr>
										<tr><td>1200 USD</td><td>Intel Core i7</td></tr>
									</table>
								</fieldset>
							</td>
							<!-- Right column of product catalog -->
							<td>
								<fieldset>
									<legend>Dell Inspiron</legend>
										<table>
											<tr><td rowspan="2"><img src="..\img\dell.png" alt="Dell Inspiron"></td><td>128GB SSD</td></tr>
											<tr><td>4GB DDR</td></tr>
											<tr><td>1150 USD</td><td>Intel Core i5</td></tr>
										</table>
								</fieldset>
								<fieldset>
									<legend><center>Asus X-Series</center></legend>
										<table>
											<tr><td rowspan="2"><img src="..\img\asus.png" alt="Asus X-Series"></td><td>64GB SSD</td></tr>
											<tr><td>6GB DDR</td></tr>
											<tr><td>1000 USD</td><td>Intel Core i5</td></tr>
										</table>
								</fieldset>
								<fieldset>
									<legend>HP ProBook</legend>
										<table>
											<tr><td rowspan="2"><img src="..\img\hp.png" alt="HP ProBook"></td><td>64GB SSD</td></tr>
											<tr><td>2GB DDR</td></tr>
											<tr><td>900 USD</td><td>Intel Core i5</td></tr>
										</table>
								</fieldset>
							</td>
						
					<!--</td>-->
					
					<!-- Right column with price and spinners -->
					<td >
						Min price: 500 USD <br />
						<input type="range" min="0" max="100" values="50"> <br /><br />
						Max price: 1500 USD <br />
						<input type="range" min="0" max="100" values="50"> <br /><br />
						Min RAM: 4GB <br />
						<input type="range" min="0" max="100" values="50"> <br /><br />
						Max RAM: 16GB <br />
						<input type="range" min="0" max="100" values="50"> <br />
					</td>
				</tr>
			</table>
		  </td></tr></table>
		</div>

	</body>
	
</html>